<template>
  <div>
    <div class="ywj_goods_container">
      <div class="ywj_img">
        <img :src="item.author.avatar_url" />
      </div>
      <div class="ywj_tit">
        <van-tag type="success"> {{ item.tab }}</van-tag>
      </div>
      <div class="ywj_title">
        {{ item.title }}
      </div>
      <div class="ywj_time">
          {{item.create_at | filterTime}}
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    item: {
      type: Object,
      required: true,
    },
  },
  filters:{
      filterTime(val){
        let d=new Date();
        let n=d.getTime();
        let s=n-val;
        var str="";
        if(s>=0 && s<1000*60*30){
            str="30分钟"
        }else if(s>=1000*60*30 && s<1000*60*60){
            str="1小时前"
        }else if(s>=1000*60*60 && s<1000*60*60*24){
            str="1天前"
        }else if(s>=1000*60*60*24 && s<1000*60*60*24*7){
            str="7天前"
        }else{
            str="很久以前"
        }
        return str
      }
  }
};
</script>
<style lang='scss' scoped>
.ywj_goods_container {
  width: 100%;
  height: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;

border-bottom:1px solid red;
  margin-top: 4px;
  .ywj_img {
    width: 15%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    img {
      width: 80%;
    }
  }
  .ywj_tit {
    width: 15%;
  }
  .ywj_title {
    width: 40%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
</style>